@charset "UTF-8";



.wrap{
  @include display(flex, space-between,center);

  .phone{
          font-size: 14px;
  }


  .login{
    @extend %parallel;
    .WeChat{
      background-image: url("images/sprite.png");
      width: 29px;
      height: 28px;
      background-position: -515px -241px;
    }

    .QQMusic{
      @extend .WeChat;
      background-position: -534px -117px;
    }

    .MicroBlog{
      @extend .WeChat;
      background-position: -563px -117px;
    }
  }

}


@media (max-width:768px ){
  .wrap{
    display: none;
  }

}


.phone-r{
  float: right;
  margin-right: 20px;
}

@media (min-width: 768px){
  .phone-r{
    display: none;
  }
}








nav{
  background:$b-head_end;

  .main-nav {

    .submenu {
      @include display(flex, space-between, center);
      width: 100%;

      .title{
        background-image: url("images/title.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 93px;
        height: 50px;
        margin-left: 20px;
      }


      .r-side {
        display: flex;
        list-style-type: none;


        a{
          border-bottom: 3px solid #29b078;
          display: inline-block;
          padding: 23px;
          color: $head_end;
          cursor: pointer;
          font-size: 16px;

        }
        a:hover{

          border-bottom: 3px solid white;
        }

        @media (min-width:0) and (max-width:768px){
          a{


            display: none;
          }

        }
      }
      @media (max-width: 768px)  {
        .r-side{
          display: none;
        }


      }
    }
  }
}





@media (max-width:768px) {
  .submenu{
    height: 63px;
    background: #29b078;
  }
}

@media (min-width:768px) {
  .hidden img{
    display: none;
  }
}

@media (max-width:768px) {
  .hidden img{

    width: 35px;
    vertical-align: middle;
    padding: 5px;
    opacity: 0.5;
    border-radius: 5px;
    background-color: #2ccf8c;
    margin-right: 20px;
  }
}


@media (min-width:768px) {
  .touch{
    display: none;
  }
}

@media (max-width:768px) {
  .touch{
    display:block; //开关
    width: 100%;
    //position: absolute;
    //top:5rem;
    padding-bottom: 13px ;
    background-color: #29b078;
    font-size: 18px;

  }
}

@media (max-width:768px) {
  .touch a{
    display:block;
    text-align: center;
    line-height: 42.5px;
    color: white;
  }
}

//@media (max-width:768px) {
//  .hidden:hover+.touch{
//    display: block;
//
//  }}


a{
  text-decoration: none;
  font-size: 14px;


}

